package gases.as3.testing
{
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	
	import gases.as3.librarys.compnents.events.SkinEvent;
	import gases.as3.librarys.compnents.events.TreeEvent;
	import gases.as3.librarys.compnents.skin.data.BaseSkin;
	import gases.as3.librarys.compnents.swf.StyleConfig;
	import gases.as3.librarys.compnents.ui.container.GPanel;
	import gases.as3.librarys.compnents.ui.container.GTitle;
	import gases.as3.librarys.compnents.ui.control.GButton;
	import gases.as3.librarys.compnents.ui.control.GScrollBar;
	import gases.as3.librarys.compnents.ui.control.Tree;
	
	public class TestingAllComponents extends Sprite
	{
		public function TestingAllComponents()
		{
			stage.align = StageAlign.TOP_LEFT;
			stage.scaleMode = StageScaleMode.NO_SCALE;
			
			instance = StyleConfig.instance;
			instance.addEventListener(SkinEvent.LOAD_COMPLETE,onComplete);
		}
		
		private function onComplete(e:Event):void
		{
			var btnGreenSkin:BaseSkin = 		instance.btnGreenSkin;
			var btnRedSkin:BaseSkin = 			instance.btnRedSkin;
			var btnScrollBgSkin:BaseSkin = 		instance.btnScrollBgSkin;
			var btnScrollDownSkin:BaseSkin = 	instance.btnScrollDownSkin;
			var btnScrollSkin:BaseSkin = 		instance.btnScrollSkin;
			var btnScrollUpSkin:BaseSkin = 		instance.btnScrollUpSkin;
			var iconlistSkin:BaseSkin = 		instance.iconListSkin;
			var panelSkin:BaseSkin = 			instance.panelSkin;
			var titleSkin:BaseSkin =			instance.titleSkin;
			var treeSkin:BaseSkin = 			instance.treeSkin;
			
			var btn:GButton = new GButton();
			btn.skin = btnGreenSkin;
			btn.selectState = false;
			btn.isSelect = false;
			btn.x =  53;
			btn.y =  25;
			this.addChild(btn);
			
			var _panel:GPanel = new GPanel(400,300); 
			_panel.skin = panelSkin;
			_panel.x = 600;
			this.addChild(_panel);
			var _title:GTitle = new GTitle(400,25,"hello world",0x000000); 
			_title.skin = titleSkin;
			_panel.addChild(_title);
			
			_tree = new Tree(); 
			_tree.x =100;
			_tree.y =100;
			_tree.treeWidth = 180;
			_tree.skin = treeSkin;
			_tree.dataProvider = xml;
			_tree.addEventListener(TreeEvent.CHANGE_HEIGHT,changeHeight);
//			_tree.addEventListener(TreeEvent.CLICK_NODE,clickNode);
			this.addChild(_tree);
			
			scrollBar= new GScrollBar(180,150,_tree,true,btnScrollUpSkin,btnScrollDownSkin,btnScrollSkin);
			scrollBar.skin = btnScrollBgSkin;
			scrollBar.x = 280;
			scrollBar.y = 100;
			this.addChild(scrollBar);
		}
		private function changeHeight(e:TreeEvent):void
		{
			scrollBar.updateScroll();
			trace(e.data);
		}
		private var _tree:Tree;
		private var scrollBar:GScrollBar;
		private var instance:StyleConfig;
		public static var xml:XML = <root>
												  <node label="first node" id="first">
													<node label="first leaf" id="1_1" data="show first leaf"/>
													<node label="second leaf"id="1_2" data="show second leaf"/>
												 </node>
												 <node label="second node" id="second">
													<node label="first component" id="2_1" data="show first component">
														<node label="second first leaf" id="2_1_1" data="second show first leaf"/>
													</node>
													<node label="second component"id="2_2" data="show second component">
														<node label="second second leaf" id="2_2_1" data="second show second leaf"/>
														<node label="second second leaf" id="2_2_2" data="second show second leaf"/>
													</node>
												 </node>
												 <node label="second node" id="second">
													<node label="first component" id="2_1" data="show first component">
														<node label="second first leaf" id="2_1_1" data="second show first leaf"/>
													</node>
													<node label="second component"id="2_2" data="show second component">
														<node label="second second leaf" id="2_2_1" data="second show second leaf"/>
														<node label="second second leaf" id="2_2_2" data="second show second leaf"/>
													</node>
												 </node>
												 <node label="second node" id="second">
													<node label="first component" id="2_1" data="show first component">
														<node label="second first leaf" id="2_1_1" data="second show first leaf"/>
													</node>
													<node label="second component"id="2_2" data="show second component">
														<node label="second second leaf" id="2_2_1" data="second show second leaf"/>
														<node label="second second leaf" id="2_2_2" data="second show second leaf"/>
													</node>
												 </node>
											 </root>;
	}
}